<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css"
	href="${res}/css/YUI/reset-min.css">
<link rel="stylesheet" type="text/css" href="${res}/css/index.css">
<!--[if IE]>
            <link rel="stylesheet" type="text/css" href="${res}/css/ie_fixies.css">
<![endif]-->
<link rel="shortcut icon" href="${res}/image/favicon.ico">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/yui/2.8.0r4/build/utilities/utilities.js"></script>
<script type="text/javascript" src="${res}/js/prototype.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.2/scriptaculous.js?load=effects"></script> 
<script type="text/javascript" src="${res}/js/tabs.js"></script>
<title>Insert title here</title>
</head>
<body>   	           
        <div id="header">
            <!-- wrapper -->
            <div class="wrapper">
                <!-- content -->
                <div id="content">                     
                    <ul id="navigation" class="clearfix">
                        <li id="about" class="firstNav tab tabActive"></li>
                        <li id="search" class="tab"></li>
                        <li id="share" class="tab"></li>
                        <li id="manage" class="tab"></li>
                        <li id="discover" class="tab"></li>
                    </ul>

                    <!-- box -->
                    <div id="mainbox" class="blueBox">
                        <div class="blueBoxTop"></div>
                        <div class="blueBoxMiddle">
                        
                            <!-- ABOUT -->
                            <div class="whiteBox slide" id="aboutSlide">
                                <div class="whiteBoxTop"></div>
                                <div class="whiteBoxMiddle">
                                    <h2 class="firstSlideHeader">What is Delibar</h2>
                                    <p class="leftSmallP">
                                        Delibar is a full featured 
                                        <a href="http://www.delicious.com" target="_blank" rel="nofollow" title="Delicious">Delicious</a> and
                                        <a href="http://pinboard.in" target="_blank" rel="nofollow" title="pinboard.in">Pinboard</a> Mac client.
                                        Delibar focuses on giving Mac OS X users an <b>easy and quick tool</b> for <b>searching</b>,
                                        <b>managing</b> and <b>sharing</b> their bookmarks.
                                        Delibar will be your best friend while using
                                        <a href="http://www.delicious.com" target="_blank" rel="nofollow">Delicious</a> or
                                        <a href="http://pinboard.in" target="_blank" rel="nofollow">Pinboard</a>!
                                    </p>

                                    <ul id="help">
                                        <li class="helpIcon" title="Delibar online help">
                                            <a rel="shadowbox;height=600;width=700;" title="Delibar online help" href="delibarHelp/top.html">Read the online help</a>
                                        </li>
                                        <li class="iMacIcon" title="Mac OS X Leopard and Snow Leopard compatibile"> 
                                            Delibar will work on any Mac with <b>Mac OS X Leopard or Snow Leopard</b>
                                        </li>
                                    </ul>
                                    
                                    <ul id="screenshotsSmall">
                                        <li id="manageSmall" title="Manager bookmark">
                                            <a href="images/screens/big/edit.jpg" rel="shadowbox[screen]" title="Manage bookmark"></a>
                                        </li>
                                        <li id="shareSmall" title="Share menu">
                                            <a href="images/screens/big/share.jpg" rel="shadowbox[screen]" title="Share menu"></a>
                                        </li>
                                        <li id="networkSmall" title="Network tab">
                                            <a href="images/screens/big/network.jpg" rel="shadowbox[screen]" title="Network tab"></a>
                                        </li>
                                        <li id="twitterSmall" title="Twitter share">
                                            <a href="images/screens/big/twitter.jpg" rel="shadowbox[screen]" title="Twitter share"></a>
                                        </li>
                                    </ul>
                                    
                                    <a rel="shadowbox;width=640;height=400;" href="screencast.html" id="screencast" title="Delibar Screencast"> </a>
                                    
                                    <!-- <h2>Delibar Free and Delibar Pro</h2> -->
                                    <p>
                                    We are currently offering Delibar in a <b>free and a pro version</b>. You can try the pro version for 2 weeks,
                                    then Delibar will automatically switch to the free version. 
                                    
                                    </p>
                                </div>
                                <div class="whiteBoxBottom"></div>
                            </div>
                            <!-- END ABOUT -->

                            <!-- SEARCH -->
                            <div class="whiteBox slide slideHidden" id="searchSlide">
                                <div class="whiteBoxTop"></div>
                                <div class="whiteBoxMiddle">
                                    <h2 class="firstSlideHeader">Find the bookmarks you are looking for instantly</h2>
                                    <div class="leftP">
                                    <p>
                                        Delibar is like <b>Spotlight for your bookmarks!</b> Just bring up the main window by clicking one of the
                                        Delibar icons and start typing: the bookmarks will be filtered by matching <b>url</b> / 
                                        <b>title</b> / <b>notes</b> / <b>tags</b> with your
                                        search.
                                    </p>
                                        
                                        
                                        <p>When you are satisfied by your search, you can open your bookmark by double cliking on it 
                                        or by selecting and hitting enter, or you can <b>save the search</b> for a later use.</p>
                                    </div>
                                   
                                    
                                    <h2>Smart searches for smart people</h2>
                                    <div class="leftP">
                                    <p><b>Sometimes a simple search is just not enough</b>, like when part of the search matches a tag name and you 
                                    don’t want a list of all your bookmarks with that tag.
                                    </p>
                                    <p> Delibar will allow you to use <b>smart operators</b>
                                    inside your search: you can use the “-” and "+" operator to exclude or include the next word or search a full phrase by 
                                    enclosing it with quotes.
                                    </p>
                                    </div>
                                    
                                    
                                </div>
                                <div class="whiteBoxBottom"></div>
                            </div>
                            <!-- END SEARCH -->

                            <!-- SHARE -->
                            <div class="whiteBox slide slideHidden" id="shareSlide">
                                <div class="whiteBoxTop"></div>
                                <div class="whiteBoxMiddle">
                                    <h2 class="firstSlideHeader">Share a website with friends, the easy way</h2>
                                    <div class="leftP">
                                        <p>With Delibar <b>sharing bookmarks with friends is easy</b>: you can send a website to them using
                                        <a href="http://twitter.com" target="_blank" rel="nofollow" title="twitter">Twitter</a>, 
                                        <a href="http://facebook.com" target="_blank" rel="nofollow" title="facebook">Facebook</a>, 
                                        <a href="http://bit.ly" target="_blank" rel="nofollow" title="bit.ly">bit.ly</a>, 
                                        <a href="http://delicious.com" target="_blank" rel="nofollow" title="delicious">Delicious</a> or
                                        <a href="http://pinboard.in" target="_blank" rel="nofollow" title="pinboard">Pinboard</a>.
                                        How easy is sharing a bookmark? Just select it and press the share button!
                                        </p>
                                    </div>

                                   

                                    <div class="cleaner"></div>
                                    
                                    <h2>Use bookmarks in other Mac applications</h2>
                                    <div class="leftP">

                                    <p>Do you want to use your bookmarks inside of other applications? No problem, 
                                        <b>Delibar is perfectly integrated to your system</b>:        
                                        Drag’n’Drop the bookmark or just copy/paste it where you need it. You can also share 
                                        your bookmark via your default email client or blogging friends via the amazing blog editor Mars Edit.
                                    </p>
                                    
                                    </div>

                                </div>
                                <div class="whiteBoxBottom"></div>
                            </div>
                            <!-- END SHARE -->
                            
                            <!-- MANAGE -->
                            <div class="whiteBox slide slideHidden" id="manageSlide">
                                <div class="whiteBoxTop"></div>
                                <div class="whiteBoxMiddle">
                                    <h2 class="firstSlideHeader">Adding bookmarks to your account is only 1 click away</h2>
                                    <div class="leftP">
                                    <p>
                                        <b>Delibar is integrated with any Mac browser</b>, so you can add bookmarks to Delicious or Pinboard.in without effort. 
                                        Just use the global hot key or install the <b>bookmarklets</b> (menu &#8220; Help -&gt; Install Bookmarklets &#8221;) and
                                        you are ready to add bookmarks to your account.
                                    </p>
                                    <p> 
                                        Delibar will fill in your <b>title, url and notes</b> (your current selection 
                                        inside the page) and will present you with a list of tags suggested by Delicious. 
                                    </p>

                                    </div>
                                    
                                  
                                
                                <div class="cleaner"></div>
                                <h2>Edit, Delete, Organize? Delibar can do it!</h2>
                                <div class="leftP">
                                    <p>
                                    Need to <b>Edit</b> or <b>Delete</b> a bookmark? No problem, Delibar is here to solve your problem! 
                                    You can edit a bookmark in the same nice window you already used to add it, and deleting 
                                    a bookmark is only a matter of one click.                                         
                                    </p>
                                    <p> 
                                        Doing the same search over and over? Save it and you will have it ready at hand! 
                                        Opening and reopening Delibar for clicking the same bookmarks? 
                                        <b>Detach the current search</b> in a floating panel! Delibar is here to serve you.                                                                       
                                    </p>
                                        
                                    </div>
                                </div>

                                <div class="whiteBoxBottom"></div>
                                
                            </div>
                            <!-- END MANAGE -->
                            
                            <!-- DISCOVER -->
                            <div class="whiteBox slide slideHidden" id="discoverSlide">
                                <div class="whiteBoxTop"></div>
                                <div class="whiteBoxMiddle">
                                    <h2 class="firstSlideHeader">Stay in touch with your network</h2>
                                    <p class="leftP">
                                        Delibar will show you the bookmarks saved on Delicious by the people that are in your network. 
                                        A nice <b>growl notification</b> will popup when someone puts a new bookmark on his/her account. Delibar 
                                        also keeps track of which bookmarks you have already visited, so you can leave a marked website that you 
                                        want to check out later.
                                    </p>
                                    
                                   

                                    <h2>Special searches</h2>
                                    <p class="leftP">
                                        Delibar allows you to use some <b>special searches</b> that will show you information about your Delibar usage:
                                    </p>
                                        <ul id="specialSearches">
                                            <li title="search by delicious tags"><b>@tags:</b>(space separed tags list): search bookmarks by a list of tags</li>
                                            <li title="search must used bookmarks"><b>@top</b>(n°): will display the n° most clicked bookmarks </li>
                                            <li title="search rarely used bookmarks"><b>@dino</b>: will display your oldest and least clicked bookmarks</li>
                                            <li title="search last bookmarks added"><b>@last</b>(n°): will display the n° last clicked bookmarks</li>
                                        </ul>
                                </div>
                                <div class="whiteBoxBottom"></div>
                            </div>
                            <!-- END DISCOVER -->            
                                                                                    
                        </div>
                        
                        <div class="blueBoxBottom"></div>
                        <div id="tabBottom" class="aboutTail"></div>

                    </div>
                    
                    <!-- end box -->
                    
                    
                    <h1>Additional information</h1>

                    <!-- box -->
                    <div class="blueBox" id="footerBox">
                        <a href="http://www.twitter.com/delibarapp" id="twitterFollow"></a>
                        <div class="blueBoxTop"></div>
                        <div class="blueBoxMiddle">
                        

                        <div class="whiteBox">
                            <div class="whiteBoxTop"></div>
                            <div class="whiteBoxMiddle">
                                <div id="shinylogo"></div>
                                <div id="moreinfo">
                                    <p>Delibar is an application by <a href="http://www.shinyfrog.net" title="mac iphone software">Shiny Frog</a></p>
                                    <p>Copyright © 2006-2009 <a href="http://www.shinyfrog.net" title="web design django italy">Shiny Frog</a> -  VAT: 02399210349</p>
                                    <p>Web Design and Code by <a href="http://www.shinyfrog.net" title="django italy parma">Shiny Frog</a>. </p>
                                </div>
                            </div>
                            <div class="whiteBoxBottom"></div>
                        </div>

                        </div>
                        <div class="blueBoxBottom"></div>

                    </div>
                    <!-- end box -->
                </div>
                <!-- end content -->
            </div>
            <!-- end wrapper -->
        </div>
        
        <script type="text/javascript">                 
            YAHOO.util.Event.onDOMReady(function () { setTabsListeners(); setDelibar(); });
        </script>
    </body>
</html>
